$(function () {
    let q = {
        pagenum: 1,
        pagesize: 2,
        cate_id: "",
        state: "",
    }
    initArticleList();

    function initArticleList() {
        axios({
            method: "GET",
            url: "/my/article/list",
            params: q
        }).then(({
            data: res
        }) => {
            if (res.status !== 0) {
                return layer.msg(res.message)
            }
            let arr = []
            res.data.forEach(ele => {
                arr.push(`
                <tr>
                <td>${ele.title}</td>
                <td>${ele.cate_name}</td>
                <td>${ formatDate(ele.pub_date)}</td>
                <td>${ele.state}</td>
                <td>
                    <button  class="layui-btn  layui-btn-xs" lay-submit lay-filter="formDemo">编辑</button>
                    <button  data-id="${ele.Id}"   class="del-btn layui-btn layui-btn-xs  layui-btn-danger">删除</button>
                </td>
            </tr>
                `);
            });
            $("tbody").empty().html(arr.join(""))
            console.log(res.total);
            renderPage(res.total)
        })
    }

    // 需求2:渲染筛选文章列表
    let layer = layui.layer;
    let form = layui.form
    initArtCateList();

    function initArtCateList() {
        axios({
            url: "/my/article/cates"
        }).then(({
            data: res
        }) => {
            console.log(res);
            if (res.status !== 0) {
                return layer.msg(res.message)
            }
            let arr = [`"<option value="">请选择文章类别</option>"`];
            res.data.forEach(ele => {
                if (ele.Id < 0) return;
                arr.push(` <option value="${ele.Id}">${ele.name}</option>`)
            });
            console.log(arr);
            let str = arr.join('')
            $("[name=cate_id]").empty().html(str);
            form.render();
        });

    }
    $("#searchForm").on("submit", function (e) {
        e.preventDefault();
        q.cate_id = $("[name=cate_id]").val()
        q.state = $("[name=state]").val()
        // 重新渲染文章列表
        initArticleList();
    })
    // 需求四:分页
    function renderPage(total) {
        let laypage = layui.laypage
        laypage.render({
            elem: "pageBox",
            count: total,
            limit: q.pagesize,
            curr: q.pagenum,
            layout: ["count", "limit", "prev", "page", "next", "refresh", "skip"],
            jump: function (obj, first) {
                if (!first) {
                    q.pagenum = obj.curr;
                    q.pagesize = obj.limit;
                    initArticleList();
                }
            }
        })
    }

    // 需求5删除
    $("tbody").on("click", ".del-btn", function () {
        let id = $(this).attr("data-id");
        //eg1
        layer.confirm('是否确认删除?', {
            icon: 3,
            title: '提示'
        }, function (index) {
            axios({
                method: "GET",
                url: "/my/article/delete/" + id,
            }).then(({
                data: res
            }) => {
                if (res.status !== 0) {
                    return layer.msg(res.message)
                }
                layer.msg("恭喜你删除文章成功!")
                $(".del-btn").length == 1 && q.pagenum >= 2 && q.pagenum--;
                initArticleList();
            })

            layer.close(index);
        });
    })


})